<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>分类页</title>
    <link rel="stylesheet" href="./css/classify.css">
    <link rel="stylesheet" href="https://at.alicdn.com/t/font_2735281_xjwmseb9km.css">
</head>
<body>
    <div class="wrap">
        <header>
            <div class="logo">
                <span>Back</span>
            </div>
            <p>分类</p>
            <div class="select">
                <select name="" id="">
                    <option value="">广州市</option>
                    <option value="">深圳市</option>
                    <option value="">北京市</option>
                </select>
            </div>
        </header>

        <div class="banner">
            <img src="./img/分类_03.gif" alt="">
        </div>

        <main>
            <div class="box">
                <div class="box-top">
                    <div class="left">
                        <i class="iconfont icon-meishi"></i>
                        <span>美食类</span>
                    </div>
                    <div class="right">
                        <span><a href="">更多</a></span>
                        <i class="iconfont icon-jiantou-you-cuxiantiao"></i>
                    </div>
                </div>

                <div class="box-list">
                    <ul>
                        <li>
                            <a href="">
                                <img src="./img/分类_06.gif" alt="">
                            </a>
                        </li>
                        <li>
                            <a href="">
                                <img src="./img/分类_08.gif" alt="">
                            </a>
                        </li>
                        <li>
                            <a href="">
                                <img src="./img/分类_10.gif" alt="">
                            </a>
                        </li>
                        <li>
                            <a href="">
                                <img src="./img/分类_12.gif" alt="">
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="box">
                <div class="box-top">
                    <div class="left">
                        <i class="iconfont icon-tubiao_yundong"></i>
                        <span>运动类</span>
                    </div>
                    <div class="right">
                        <span><a href="">更多</a></span>
                        <i class="iconfont icon-jiantou-you-cuxiantiao"></i>
                    </div>
                </div>

                <div class="box-list">
                    <ul>
                        <li>
                            <a href="">
                                <img src="./img/分类_17.gif" alt="">
                            </a>
                        </li>
                        <li>
                            <a href="">
                                <img src="./img/分类_19.gif" alt="">
                            </a>
                        </li>
                        <li>
                            <a href="">
                                <img src="./img/分类_20.gif" alt="">
                            </a>
                        </li>
                        <li>
                            <a href="">
                                <img src="./img/分类_21.gif" alt="">
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="box">
                <div class="box-top">
                    <div class="left">
                        <i class="iconfont icon-dianying"></i>
                        <span>电影类</span>
                    </div>
                    <div class="right">
                        <span><a href="">更多</a></span>
                        <i class="iconfont icon-jiantou-you-cuxiantiao"></i>
                    </div>
                </div>

                <div class="box-list">
                    <ul>
                        <li>
                            <a href="">
                                <img src="./img/分类_26.gif" alt="">
                            </a>
                        </li>
                        <li>
                            <a href="">
                                <img src="./img/分类_28.gif" alt="">
                            </a>
                        </li>
                        <li>
                            <a href="">
                                <img src="./img/分类_29.gif" alt="">
                            </a>
                        </li>
                        <li>
                            <a href="">
                                <img src="./img/分类_29.gif" alt="">
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
        </main>

        <footer>
            <ul>
                <li>
                    <a href="./index.html">
                        <i class="iconfont icon-shouye-weixuanzhong"></i>
                        <span>首页</span>
                    </a>
                </li>
                <li>
                    <a href="./classify.html">
                        <i class="iconfont icon-leimupinleifenleileibie2"></i>
                        <span>分类</span>
                    </a>
                </li>
                <li>
                    <a href="./discover.html">
                        <i class="iconfont icon-faxian-xianxing"></i>
                        <span>发现</span>
                    </a>
                </li>
                <li>
                    <a href="./my2.html">
                        <i class="iconfont icon-wode_weixuanzhong"></i>
                        <span>我的</span>
                    </a>
                </li>
            </ul>
        </footer>
    </div>
</body>
</html>